<template>
  <div class="demoIndex">
    <div class="demoIndex-menu">
      <sidebar :routes="sidebarRoutes" />
    </div>
    <div class="demoIndex-container">
      <router-view></router-view>
    </div>
  </div>
</template>
<script>
import Sidebar from "@/components/subMenu/SubMenuIndex.vue";

export default {
  components: { Sidebar },
  computed: {
    showHeader() {
      return this.$route.path !== "/login";
    },
    showSidebar() {
      return ["/home", "/demo"].includes(this.$route.path);
    },
    sidebarRoutes() {
      const current = this.$router.options.routes.find(
        (route) => route.path === this.$route.matched[0]?.path
      );

      return current?.children || [];
    },
  },
};
</script>
<style>
.demoIndex {
  width: 100%;
  height: 100%;
  display: flex;
}
.demoIndex-container {
  flex: 1;
  padding: 20px;
  overflow: auto;
}
</style>
